<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
		<meta name="description" content="我的账本增加消费记录">
		
		<link rel="stylesheet" href="../weui/lib/weui.min.css">
		<link rel="stylesheet" href="../weui/css/jquery-weui.css">
		<link rel="stylesheet" href="../css/Gstyle.css">

		<title>增加消费记录-我的账本</title>
		<style>
			body{
				touch-action: none;
			}
		</style>
	</head>
	<body>
		<h1 style="margin-left: 10px;margin-top: 10px;">增加消费记录</h1>
		
		<div class="weui-cells weui-cells_form">
			<div class="weui-cell">
				<div class="weui-cell__hd"><label class="weui-label">时间</label></div>
				<div class="weui-cell__bd">
					<input class="weui-input" id="time" type="text" value="" readonly="readonly">
				</div>
			</div>
			
			<div class="weui-cell">
				<div class="weui-cell__hd"><label class="weui-label">金额</label></div>
				<div class="weui-cell__bd">
					<input class="weui-input" type="number" placeholder="消费金额">
				</div>
			</div>
			
			<div class="weui-cell">
				<div class="weui-cell__hd">
					<label for="" class="weui-label">类型</label>
				</div>
				<div class="weui-cell__bd">
                    <input id="typeselect" class="weui-input" type="text" value="午饭" readonly="readonly" onclick="showPicker()">
                    <input id="costtypeid" style="display:none" class="weui-input" type="text" value="444deb215cd94e599b65e87524784735">
				</div>
			</div>
			
			<div style="height: 1px;border-top: 1px solid #D9D9D9;color: #D9D9D9;-webkit-transform-origin: 0 0;transform-origin: 0 0;-webkit-transform: scaleY(0.5);transform: scaleY(0.5);left: 15px;"></div>
			
			<div class="weui-cells__title" style="color: #000000;font-size: 17px;">备注</div>
			<div class="weui-cells weui-cells_form">
				<div class="weui-cell">
					<div class="weui-cell__bd">
						<textarea id="textarea" class="weui-textarea" placeholder="请输入文本" rows="3"></textarea>
						<!--<div class="weui-textarea-counter"><span>0</span>/200</div>-->
					</div>
				</div>
			</div>
			
			<div class="weui-cell">
				<div class="weui-cell__hd"><label class="weui-label">金额</label></div>
				<div class="weui-cell__bd">
					<input class="weui-input" type="number" placeholder="消费金额">
				</div>
			</div>
		</div>
		
		<div class="weui-btn-area">
			<a class="weui-btn weui-btn_primary" href="javascript:" id="showTooltips">提交</a>
		</div>
		
		<script src="../weui/lib/jquery-2.1.4.js"></script>
		<script src="../weui/lib/fastclick.js"></script>
		<script>
			function getLocation() {
	var options = {
		enableHighAccuracy: true,
		maximumAge: 1000
	}
	if(navigator.geolocation) {
		//浏览器支持geolocation
		navigator.geolocation.getCurrentPosition(onSuccess, onError, options);
	} else {
		//浏览器不支持geolocation
	}
}
//成功时
function onSuccess(position) {
	//返回用户位置
	//经度
	var longitude = position.coords.longitude;
	//纬度
	var latitude = position.coords.latitude;
	
	latlon = position.coords.latitude+','+position.coords.longitude;
      
    //baidu   
    var url = "http://api.map.baidu.com/geocoder/v2/?ak=yVHqjQWMKk0kP5xr0e0Mi1P3OB1qy9ed&callback=renderReverse&location="+latlon+"&output=json&pois=0&coordtype=wgs84ll";   
    $.ajax({    
        type: "GET",    
        dataType: "jsonp",    
        url: url,   
        beforeSend: function(){   
            $("#textarea").html('正在定位...');   
        },   
        success: function (json) {    
            if(json.status==0){   
                $("#textarea").html(json.result.formatted_address);   
            }   
        },   
        error: function (XMLHttpRequest, textStatus, errorThrown) {    
            $("#textarea").html(latlon+"地址位置获取失败");    
        }   
    });   
}
//失败时
function onError(error) {
	switch(error.code) {
		case 1:
			alert("位置服务被拒绝");
			break;
		case 2:
			alert("暂时获取不到位置信息");
			break;
		case 3:
			alert("获取信息超时");
			break;
		case 4:
			alert("未知错误");
			break;
	}
}</script>
		<script>
			var typepickinfo;
			$(function() {
				FastClick.attach(document.body);
				var d = new Date();
				var str = d.getFullYear()+"-"+(d.getMonth()+1)+"-"+d.getDate() + " " + d.getHours() + ":" + d.getMinutes();
				$("#time").val(str);
				
				$("#time").datetimePicker({
					title: '消费时间',
					min: "1990-12-12",
					max: "2100-12-12 12:12",
					onChange: function (picker, values, displayValues) {
						console.log(values);
					}
				});
				
				$.showLoading("正在加载");

		        $.ajax({
		            url: '/FA_WebCilent/FA_WebCilent/ViewAction/ActionProcess.ashx',
		            type: "POST",
		            data: {
		                action: "getalltypejson"
		            },
		            dataType: 'json',
		            success: function (data) {
		                $.hideLoading();
		                if (data.msg == 0) {
		                    $.toast("消费类型获取失败","forbidden");
		                } else {
		                    typepickinfo = data.msgbox;
		                }
		            },
		            error: function () {
		                $.hideLoading();
		                $.toast("系统错误", "forbidden");
		            }
		        });
		        
		        setTimeout(function () {getLocation() }, 500);
			});
			
		</script>
		<script src="../weui/js/jquery-weui.js"></script>
		<script src="../js/viewindex.js"></script>
		
		<script type="text/javascript" src="../weui/lib/weui.min.js"></script>
        <script>
            function showPicker()
            {
            	weui.picker([
				{
					label:"1",
					value:"1",
					children:[
						{
							label:"11",
							value:"11"
						},
						{
							label:"12",
							value:"12"
						},
						{
							label:"13",
							value:"13"
						}
					]
				},
				{
					label:"2",
					value:"2",
					children:[
						{
							label:"21",
							value:"21"
						},
						{
							label:"22",
							value:"22"
						},
						{
							label:"23",
							value:"23"
						}
					]
				}],
				{
					defaultValue:["2","22"],
					onConfirm: function onConfirm(result)
					{
						$("#typeselect").val(result[1].label);
						$("#costtypeid").val(result[1].value);
					},
					id: 'typeselect'
				}
				);
            }
        </script>
	</body>
</html>
